import dayjs from 'dayjs'
import { Button } from 'antd'
import { useState } from 'react'
import { useMount } from 'ahooks'

import { WijmoOLAP } from '../../Router/Wijmo'
import { GetIndexedDB } from '../../Utils/IndexedDB'

import { RedoOutlined, SearchOutlined, ExportOutlined, BarChartOutlined, RadarChartOutlined } from '@ant-design/icons';


const wijmoConfig = async () => {
    const options = await GetIndexedDB('options')
    return ({
        get: 'getBuyReturnInfoGetBuyOrderOlap',
        initCom: 'A01',
        params: {
            statisticstype: 0,
            orgtype: 0,
            pageIndex: 1,
            pageSize: 100000,
        },
        combination: {
            A01: {
                title: '全部费用统计',
                data: {
                    // 总计显示 0:不显示总数 1:显示总数 2:显示小计和总计
                    defaultFilterType: 3,
                    showZeros: false,
                    sortableGroups: true,
                    totalsBeforeData: false,
                    showRowTotals: 2,
                    showColumnTotals: 2,
                    fields: [
                        { binding: 'yearPart', header: '年份', align: 'center' },
                        { binding: 'monthPart', header: '月份', align: 'center' },
                        { binding: 'dayPart', header: '日期', align: 'center' },
                        { binding: 'status', header: '订单状态', align: 'center' },
                        { binding: 'personName', header: '客户姓名', align: 'center' },
                        { binding: 'supplierName', header: '供应商', align: 'center' },
                        { binding: 'productName', header: '产品名称', align: 'center' },
                        { binding: 'quantity', header: '数量', align: 'center' },
                        { binding: 'unit', header: '单位', align: 'center' },
                        { binding: 'amount', header: '金额', align: 'center' },
                    ],
                    filterFields: { items: [] },
                    rowFields: { items: ["产品名称"] },
                    columnFields: { items: ["年份", "月份"] },
                    valueFields: { items: ["金额", '数量'] }
                }
            }
        },
        configuration: {
            isReadOnly: true,
            allowSorting: 'SingleColumn',
            selectionMode: 5,
            customContextMenu: false,
            showDetailOnDoubleClick: false
        },
        optionsBtn: click => ([
            {
                key: '1',
                type: 'group',
                label: '数据操作',
                children: [
                    { key: '1-2', label: <Button type='link' onClick={() => click('onOLAP')}><RadarChartOutlined style={{ color: '#13c2c2' }} />数据中控</Button> },
                    { key: '3-1', label: <Button type='link' onClick={() => click('onChart')}><BarChartOutlined style={{ color: '#13c2c2' }} />查看图例</Button> },
                ],
            },
            {
                key: '0',
                type: 'group',
                label: '数据查询',
                children: [
                    { key: '0-1', label: <Button type='link' onClick={() => click('onRefresh')}><RedoOutlined style={{ color: '#13c2c2' }} />刷新数据</Button> },
                    { key: '0-2', label: <Button type='link' onClick={() => click('onSearch')}><SearchOutlined style={{ color: '#13c2c2' }} />条件搜索</Button> },
                ]
            },
            {
                key: '2',
                type: 'group',
                label: '导出数据',
                children: [
                    { key: '2-1', label: <Button type='link' onClick={() => click('onSaveAct')}><ExportOutlined style={{ color: '#13c2c2' }} />导出选中数据</Button> },
                    { key: '2-2', label: <Button type='link' onClick={() => click('onSaveAll')}><ExportOutlined style={{ color: '#13c2c2' }} />导出全部数据</Button> },
                ],
            },
        ]),
        gridConfig: {
            initParameter: {
                group: [],
                sort: [],
                groupPanel: true,
                filter: true,
                addSum: true,
                addIndex: true,
                topText: 'Ω',
                btmText: 'Ψ',
            },
            configuration: {
                allowSorting: 'MultiColumn',
                isReadOnly: true,
                selectionMode: 5,
                allowMerging: "Cells"
            },
            columns: [ // 字段设置
                {
                    title: '年份',
                    dataIndex: 'yearPart',
                    valueType: 'Input',
                    width: 240,
                    align: 'center',
                    hideInSearch: true,
                },
                {
                    title: '月份',
                    dataIndex: 'monthPart',
                    valueType: 'Input',
                    width: 240,
                    align: 'center',
                    hideInSearch: true,
                },
                {
                    title: '日期',
                    dataIndex: 'dayPart',
                    valueType: 'Input',
                    width: 240,
                    align: 'center',
                    hideInSearch: true,
                },
                {
                    title: '订单状态',
                    dataIndex: 'status',
                    valueType: 'Select',
                    valueEnum: [
                        { label: '待发货', value: '待发货' },
                        { label: '已发货', value: '已发货' },
                        { label: '已收货', value: '已收货' },
                        { label: '作废', value: '作废' },
                    ],
                    width: 240,
                    align: 'center',
                },
                {
                    title: '客户姓名',
                    dataIndex: 'personName',
                    valueType: 'Input',
                    width: 240,
                    align: 'center',
                },
                {
                    title: '供应商',
                    dataIndex: 'supplierName',
                    valueType: 'Input',
                    width: 240,
                    align: 'center',
                },
                {
                    title: '产品名称',
                    dataIndex: 'productName',
                    valueType: 'Input',
                    width: 240,
                    align: 'center',
                },
                {
                    title: '数量',
                    dataIndex: 'quantity',
                    valueType: 'Input',
                    width: 240,
                    align: 'center',
                    hideInSearch: true,
                },
                {
                    title: '单位',
                    dataIndex: 'unit',
                    valueType: 'Input',
                    width: 240,
                    align: 'center',
                    hideInSearch: true,
                },
                {
                    title: '金额',
                    dataIndex: 'amount',
                    valueType: 'Input',
                    width: 240,
                    align: 'center',
                    aggregate: 3,
                    format: 'n2',
                    aggTitle: '总计',
                    smlTitle: '小计',
                    hideInSearch: true,
                },
                {
                    title: '订单开始时间',
                    dataIndex: 'StartDateA01',
                    valueType: 'DatePicker',
                    picker: 'date',
                    hideInTable: true,
                },
                {
                    title: '订单结束时间',
                    dataIndex: 'EndDateA01',
                    valueType: 'DatePicker',
                    picker: 'date',
                    hideInTable: true,
                },
            ],
        }
    })
}


const GetBuyOrderOlap = () => {
    const [WijmoConfig, setWijmoConfig] = useState()
    useMount(async () => setWijmoConfig(await wijmoConfig()))
    return (
        <div className='CaiLiaoYunShuTongJi'>
            {WijmoConfig && <WijmoOLAP Config={WijmoConfig} />}
        </div>
    );
};

export default GetBuyOrderOlap;